.noora-card__section {
  &[data-empty] {
    align-items: center;
    padding-top: var(--noora-spacing-11);
    padding-bottom: var(--noora-spacing-11);
    & > [data-part="title"] {
      padding-top: var(--noora-spacing-5);
      color: var(--noora-surface-label-secondary);
      font: var(--noora-font-weight-medium) var(--noora-font-body-medium);
    }

    & > [data-part="image"] {
      height: 122px;

      & > img {
        border-radius: 10px;
        html[data-theme="light"] &[data-theme="dark"] {
          display: none;
        }

        html[data-theme="dark"] &[data-theme="light"] {
          display: none;
        }
        &[data-theme="light"] {
          box-shadow:
            0px 60px 16.667px 0px oklch(31.3% 0 0 / 0),
            0px 38.333px 15.833px 0px oklch(31.3% 0 0 / 0.01),
            0px 21.667px 13.333px 0px oklch(31.3% 0 0 / 0.05),
            0px 10px 10px 0px oklch(31.3% 0 0 / 0.09),
            0px 2.5px 5px 0px oklch(31.3% 0 0 / 0.1),
            0px 0px 0px 0.833px oklch(31.8% 0.011 248.2 / 0.08);
        }
        &[data-theme="dark"] {
          box-shadow:
            0px 60px 16.667px 0px oklch(0% 0 0 / 0),
            0px 38.333px 15.833px 0px oklch(0% 0 0 / 0.01),
            0px 21.667px 13.333px 0px oklch(0% 0 0 / 0.05),
            0px 10px 10px 0px oklch(0% 0 0 / 0.09),
            0px 2.5px 5px 0px oklch(0% 0 0 / 0.1),
            0px 0px 0px 0.833px oklch(31.6% 0.01 260.7 / 0.9) inset;
        }
      }

      & > svg {
        width: 100%;
        height: 100%;
      }
    }

    & > * {
      z-index: var(--noora-z-index-2);
    }

    & > [data-part="background"] {
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      z-index: var(--noora-z-index-1);

      & svg {
        width: 100%;
        height: 100%;
      }
    }
  }
}
